<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:replace="head"></div>
    <!-- DataTables -->
    <title>订单管理</title>
    <link rel="stylesheet" href="../plugins/datatables/dataTables.bootstrap.css"/>
</head>

<body class="hold-transition skin-blue sidebar-mini ">
<div class="wrapper">

    <div th:replace="header"></div>
    <div th:replace="sidebar"></div>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box list-group">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="panel-title"> 订单详情</h4>
                            </div>
                        </div>
                        <div class="box-body panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title glyphicon glyphicon-align-justify"> 基本信息</h3>
                            </div>
                            <div class="panel-body">
                                <span class="col-lg-4" th:text="'订单编号：' + ${detail.orderId}"></span>
                                <span class="col-lg-4" th:text="'订单状态：' + ${detail.status}"></span>
                                <span class="col-lg-4" th:text="'付款方式：无'"></span>
                            </div>
                            <div class="panel-heading">
                                <h3 class="panel-title glyphicon glyphicon-align-justify"> 取票信息</h3>
                            </div>
                            <div class="panel-body">
                                <span class="col-lg-4" th:text="'姓名：' + ${detail.name}"></span>
                                <span class="col-lg-4" th:text="'手机号码：' + ${detail.phone}"></span>
                                <table class="table table-bordered table-striped col-lg-12">
                                    <thead>
                                    <tr>
                                        <th>订单编号</th>
                                        <th>演出名称</th>
                                        <th>数量</th>
                                        <th>买家</th>
                                        <th>下单状态</th>
                                        <th>下单时间</th>
                                        <th>付款金额</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr>
                                        <td th:text="${detail.orderId}"></td>
                                        <td th:text="${detail.playName}"></td>
                                        <td th:text="${detail.quantity}"></td>
                                        <td th:text="${detail.nickName}"></td>
                                        <td th:text="${detail.status}"></td>
                                        <td th:text="${detail.createTime} ? ${#dates.format(detail.createTime, 'yyyy-MM-dd HH:mm:ss')}"></td>
                                        <td th:text="${detail.payAmount}"></td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="panel-heading"><h3 class="panel-title glyphicon glyphicon-align-justify"> 备注信息</h3></div>
                            <div class="panel-body">
                                <form th:action="@{/order/remark}" method="post">
                                    <input type="hidden" name="id" th:value="${detail.id}"/>
                                    <span class="col-lg-1">备注：</span>
                                    <textarea name="remark" class="col-lg-10" rows="3" th:text="${detail.remark}"></textarea>
                                    <div class="col-lg-1">
                                        <button class="btn btn-default" type="submit" id="remarkBtn">保存</button>
                                    </div>
                                </form>
                            </div>
                            <div class="panel-heading"><h3 class="panel-title glyphicon glyphicon-align-justify"> 操作日志</h3></div>
                            <div class="panel-body">
                                <span class="col-lg-4" th:text="暂无日志"></span>
                            </div>
                        </div>
                        <!-- /.box-body -->
                    </div>
                    <!-- /.box -->
                </div>
                <!-- /.col -->
            </div>
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
</div>

<div th:replace="script"></div>

<!-- page script -->
<script th:src="@{/js/list-page.js}"></script>
<script>
    $(function () {
        $('#dataTable').DataTable({
            "paging": true,
            "lengthChange": false,
            "searching": false,
            "ordering": true,
            "info": true,
            "autoWidth": false
        });
    });
    function saveremark() {

    }
</script>
</body>
</html>